<template>
	<view class="padding">
		<view class="text-white padding bg radius">
			<u-form :model="shop" label-position="top">
				<u-form-item label="店铺名称 ">
					<text class="text-sm" @click="gokefu()"
						style="color: red;position: absolute;top: 20rpx;left:135rpx;">*请联系客服修改</text>
					<u-input v-model="shop.shopName" placeholder="请输入店铺名称" :disabled="true" />
				</u-form-item>
				<!-- <u-form-item label="开店时间"> -->
					<!-- #ifdef MP-WEIXIN -->
					<!-- <u-input v-model="shop.businessHours" placeholder="请填写" :disabled="true"
						@click="startShow = true" /> -->
					<!-- #endif -->
					<!-- #ifndef MP-WEIXIN -->
					<!-- <view style="width: 100%;">
						<picker mode="time" :value="shop.businessHours" placeholder="请填写" start="00:00" end="23:59"
							@change="bindTimeChange">
							<view class="uni-input">{{shop.businessHours?shop.businessHours:'请填写'}}</view>
						</picker>
					</view> -->
					<!-- #endif -->
				<!-- </u-form-item> -->
				<!-- <u-form-item label="闭店时间"> -->
					<!-- #ifdef MP-WEIXIN -->
					// <u-input v-model="shop.lockHours" :disabled="true" placeholder="请填写" @click="endShow = true" />
					<!-- #endif -->
					<!-- #ifndef MP-WEIXIN -->
					<!-- <view style="width: 100%;">
						<picker mode="time" :value="shop.lockHours" placeholder="请填写" start="00:00" end="23:59"
							@change="bindTimeChanges">
							<view class="uni-input">{{shop.lockHours?shop.lockHours:'请填写'}}</view>
						</picker>
					</view> -->
					<!-- #endif -->
				<!-- </u-form-item> -->
				<u-form-item label="店铺地址">
					<text class="text-sm" @click="gokefu()"
						style="color: red;position: absolute;top: 20rpx;left:135rpx;">*请联系客服修改</text>
					<!-- @click="bindOpen()" -->
					<u-input v-model="shop.detailedAddress" :disabled="true" placeholder="请填写" />
				</u-form-item>
				<u-form-item label="店铺公告">
					<textarea v-model="shop.shopNotice" rows="3" placeholder="请填写" maxlength="50" />
				</u-form-item>
				<u-form-item label="配送费(元)">
					<text class="text-sm" @click="gokefu()"
						style="color: red;position: absolute;top: 20rpx;left:155rpx;">*请联系客服修改</text>
					<u-input v-model="shop.errandMoney" placeholder="请输入配送费" :disabled="true" />
				</u-form-item>
				<u-form-item label="最低起送金额(元)">
					<u-input v-model="shop.minimumDelivery" placeholder="请输入最低起送金额" />
				</u-form-item>
				<u-form-item label="减免配送费最小订单金额(元)">
					<u-input v-model="shop.exemptMinMoney" placeholder="请输入减免配送费最小订单金额" />
				</u-form-item>
				<u-form-item label="最大配送距离(千米)">
					<text class="text-sm" @click="gokefu()"
						style="color: red;position: absolute;top: 20rpx;left:285rpx;">*请联系客服修改</text>
					<u-input v-model="distributionDistance" placeholder="请输入最大配送距离(单位:km)" :disabled="true" />
				</u-form-item>
				<u-form-item label="是否上线">
					<u-radio-group v-model="shop.putawayFlag">
						<u-radio name=0>上班啦</u-radio>
						<u-radio name=1>打烊啦</u-radio>
					</u-radio-group>
				</u-form-item>
				<u-form-item label="是否开启平台配送">
					<u-radio-group v-model="shop.autoSendOrder">
						<u-radio name=0>开启</u-radio>
						<u-radio name=1>关闭</u-radio>
					</u-radio-group>
				</u-form-item>
				<u-form-item label="是否开启自动接单">
					<u-radio-group v-model="shop.autoAcceptOrder">
						<u-radio name=0>开启</u-radio>
						<u-radio name=1>关闭</u-radio>
					</u-radio-group>
				</u-form-item>
			</u-form>
		</view>

		<view class="text-white padding bg radius margin-tb">
			<u-form :model="shop" label-position="top">
				<u-form-item label="打印机">
					<text class="text-sm"
						style="color: red;position: absolute;top: 25rpx;left: 105rpx;">*一个打印机只能绑定一个商家</text>
					<u-radio-group v-model="shop.facility">
						<!-- <u-radio name=0>上线</u-radio> -->
						<u-radio name=1>飞鹅</u-radio>
					</u-radio-group>
				</u-form-item>
				<u-form-item label="设备sn编码">
					<u-input v-model="shop.snCode" placeholder="请输入设备sn编码" />
				</u-form-item>
				<u-form-item label="设备key秘钥">
					<u-input v-model="shop.value" placeholder="请输入设备key秘钥" />
				</u-form-item>
			</u-form>
		</view>
		<view class="text-white padding bg radius margin-tb">
			<view>
				<view class="text-lg margin-top-sm text-black">店铺logo</view>
				<view class="flex" style="overflow: hidden;flex-wrap: wrap;">
					<view v-if="shop.shopCover.length">
						<view class="margin-top flex margin-right-sm flex-wrap">
							<view class="flex"
								style="width: 200rpx;height: 200rpx;margin-right: 2rpx;position: relative;">
								<image :src="shop.shopCover" style="width: 100%;height: 100%;"></image>
								<view style="z-index: 9;position: absolute;top: -15rpx;right: -15rpx;"
									@click="removeImgs()">
									<u-icon name="close-circle-fill" color="#2979ff" size="50rpx"></u-icon>
								</view>

							</view>
						</view>
					</view>
					<view class="margin-top" @click="addImage()" v-if="shop.shopCover.length<=0">
						<view style="width: 200rpx;height: 200rpx;background: #f4f5f6;"
							class="flex justify-center align-center">
							<view>
								<view class="text-center">
									<image src="../static/addimg.png" style="width: 65rpx;height: 55rpx;">
									</image>
								</view>
								<view class="text-center text-black">添加图片</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view>
				<view class="text-lg margin-top-sm text-black">店铺活动广告图（可多张）</view>
				<view class="flex" style="overflow: hidden;flex-wrap: wrap;">
					<view v-if="shopBanner.length">
						<view class="margin-top flex margin-right-sm flex-wrap">
							<view class="flex"
								style="width: 200rpx;height: 200rpx;margin-right: 2rpx;position: relative;"
								v-for="(image,index) in shopBanner" :key="index">
								<image :src="image" style="width: 100%;height: 100%;"></image>
								<view style="z-index: 9;position: absolute;top: -15rpx;right: -15rpx;"
									@click="removeImg(index)">
									<u-icon name="close-circle-fill" color="#2979ff" size="50rpx"></u-icon>
								</view>

							</view>
						</view>
					</view>
					<view class="margin-top" @click="addImages(2)" v-if="shopBanner.length<6">
						<view style="width: 200rpx;height: 200rpx;background: #f4f5f6;"
							class="flex justify-center align-center">
							<view>
								<view class="text-center">
									<image src="../static/addimg.png" style="width: 65rpx;height: 55rpx;">
									</image>
								</view>
								<view class="text-center text-black">添加图片</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>

		<!-- 时间筛选 -->
		<u-picker v-model="startShow" mode="time" :params="params" @confirm="getStarttime()"></u-picker>

		<u-picker v-model="endShow" mode="time" :params="paramss" @confirm="getEndtime()"></u-picker>


		<u-button @click="submit" class="margin-top" :custom-style="customStyle" shape="square" :hair-line="false">提交
		</u-button>

	</view>
</template>

<script>
	import configdata from '@/common/config.js';
	export default {

		data() {
			return {
				shop: {
					shopName: '',
					businessHours: '',
					lockHours: '',
					detailedAddress: '',
					shopNotice: '',
					putawayFlag: 1,
					latitude: '',
					longitude: '',
					shopCover: '',
					//详情图
					shopBanner: [],
					shopId: uni.getStorageSync('shopId'),
					errandMoney: '',
					minimumDelivery: '',
					exemptMinMoney: '',
					distributionDistance: '',
					autoSendOrder: 1,
					autoAcceptOrder: 1,
					facility: 1,
					snCode: '',
					value: ''
				},
				// facility:1,
				startShow: false,
				endShow: false,
				customStyle: {
					backgroundColor: '#FFCC00',
					color: '#000000',
					border: 0
				},
				status: 1,
				customStyle1: {
					color: '#000000',
					position: "fixed",
					bottom: "15rpx",
					left: "0rpx",
					right: "0rpx",
					margin: "0rpx 50rpx",
					backgroundColor: '#FFCC00',
				},
				selarr: [],
				show: false,
				//详情图
				shopBanner: [],
				params: {
					year: false,
					month: false,
					day: false,
					hour: true,
					minute: true,
					second: false
				},
				paramss: {
					year: false,
					month: false,
					day: false,
					hour: true,
					minute: true,
					second: false
				},
				shopId: '',

				page: 1,
				limit: 100,
				list: [{
						name: '上线',
						disabled: false
					},
					{
						name: '下线',
						disabled: false
					}
				],
				distributionDistance: ''
			}
		},
		onLoad(option) {
			uni.showLoading({
				title: '加载中......',
				icon: 'loading'
			})
			// console.log(option, '店铺id')
			this.shopId = option.shopId

			this.getShopList()
		},
		onShow() {

		},
		methods: {
			gokefu() {
				uni.navigateTo({
					url: '/pages/my/chat'
				})
			},
			bindTimeChange: function(e) {
				console.log(e)
				this.shop.businessHours = e.target.value
			},
			bindTimeChanges: function(e) {
				console.log(e)
				this.shop.lockHours = e.target.value
			},
			//上线  下线
			radioChange(e) {
				// console.log(e)
			},
			// 店铺信息
			getShopList() {
				let data = {
					shopId: this.$queue.getData('shopId')
				}
				this.$Request.getA("/admin/shop/selectShopMessage", data).then(res => {
					if (res.code == 0) {
						uni.hideLoading()
						this.shop.shopName = res.data.shopName
						this.shop.detailedAddress = res.data.detailedAddress
						this.shop.businessHours = res.data.businessHours
						this.shop.lockHours = res.data.lockHours
						this.shop.shopCover = res.data.shopCover
						this.shop.shopNotice = res.data.shopNotice
						this.shop.putawayFlag = res.data.putawayFlag ? res.data.putawayFlag : 0
						this.shop.errandMoney = res.data.errandMoney
						this.shop.minimumDelivery = res.data.minimumDelivery
						this.shop.exemptMinMoney = res.data.exemptMinMoney
						if (res.data.shopBanner) {
							this.shop.shopBanner = res.data.shopBanner.split(',')
							this.shopBanner = res.data.shopBanner.split(',')
						}
						this.shop.distributionDistance = res.data.distributionDistance
						this.distributionDistance = res.data.distributionDistance / 1000
						this.shop.autoSendOrder = res.data.autoSendOrder ? res.data.autoSendOrder : 0;
						this.shop.autoAcceptOrder = res.data.autoAcceptOrder ? res.data.autoAcceptOrder : 0;
						this.shop.snCode = res.data.snCode //设备sn编码
						this.shop.value = res.data.value //设备key秘钥
						// this.shop.facility = res.data.facility // 设备类型
					}
				});
			},
			getStarttime(e) {
				console.log(e, '1111111111')

				this.shop.businessHours = e.hour + ':' + e.minute
			},
			getEndtime(e) {
				console.log(e)
				this.shop.lockHours = e.hour + ':' + e.minute
			},
			// 详情图删除
			removeImg(index) {
				this.shopBanner.splice(index, 1)
			},
			// 店铺logo删除
			removeImgs() {
				this.shop.shopCover = ''
			},
			bindOpen(e) {
				console.log(e)
				let that = this
				uni.chooseLocation({
					success: function(res) {
						console.log('位置名称：' + res.name);
						console.log('详细地址：' + res.address);
						console.log('纬度：' + res.latitude);
						console.log('经度：' + res.longitude);
						that.shop.detailedAddress = res.address
						that.shop.shopLat = res.latitude
						that.shop.shopLng = res.longitude
					}
				});
			},

			// 图片上传
			addImages(e) {
				let that = this
				uni.chooseImage({
					count: 6,
					sourceType: ['album', 'camera'],
					success: res => {
						for (let i = 0; i < res.tempFilePaths.length; i++) {
							that.$queue.showLoading("上传中...");
							uni.uploadFile({ // 上传接口
								url: that.config("APIHOST1") + '/alioss/upload', //真实的接口地址
								filePath: res.tempFilePaths[i],
								name: 'file',
								success: (uploadFileRes) => {
									if (that.shopBanner.length < 6) {
										that.shopBanner.push(JSON.parse(uploadFileRes.data).data)
									}

									console.log(that.shopBanner)
									uni.hideLoading();
								}
							});
						}
					}
				})
			},
			// 图片上传
			addImage() {
				let that = this
				uni.chooseImage({
					count: 1,
					sourceType: ['album', 'camera'],
					success: res => {
						for (let i = 0; i < res.tempFilePaths.length; i++) {
							that.$queue.showLoading("上传中...");
							uni.uploadFile({ // 上传接口
								url: that.config("APIHOST1") + '/alioss/upload', //真实的接口地址
								// url: 'https://jiazheng.xianmxkj.com/sqx_fast/alioss/upload',
								filePath: res.tempFilePaths[i],
								name: 'file',
								success: (uploadFileRes) => {
									that.shop.shopCover = JSON.parse(uploadFileRes.data).data
									uni.hideLoading();
								}
							});
						}
					}
				})
			},
			config: function(name) {
				var info = null;
				if (name) {
					var name2 = name.split("."); //字符分割
					if (name2.length > 1) {
						info = configdata[name2[0]][name2[1]] || null;
					} else {
						info = configdata[name] || null;
					}
					if (info == null) {
						let web_config = cache.get("web_config");
						if (web_config) {
							if (name2.length > 1) {
								info = web_config[name2[0]][name2[1]] || null;
							} else {
								info = web_config[name] || null;
							}
						}
					}
				}
				return info;
			},
			// 发布
			submit() {
				console.log(this.distributionDistance)
				this.shop.shopBanner = this.shopBanner
				this.shop.shopBanner = this.shop.shopBanner.toString();
				this.shop.distributionDistance = this.distributionDistance * 1000
				// this.shop.distributionDistance = this.shop.distributionDistance * 1000

				// if (!this.shop.shopName) {
				// 	uni.showToast({
				// 		title: '请填写店铺名称',
				// 		icon: 'none',
				// 		duration: 1000
				// 	})
				// 	return
				// }
				if (!this.shop.businessHours) {
					uni.showToast({
						title: '请填写开店时间',
						icon: 'none',
						duration: 1000
					})
					return
				}
				if (!this.shop.lockHours) {
					uni.showToast({
						title: '请填写闭店时间',
						icon: 'none',
						duration: 1000
					})
					return
				}
				// if (!this.shop.detailedAddress) {
				// 	uni.showToast({
				// 		title: '请填写店铺地址',
				// 		icon: 'none',
				// 		duration: 1000
				// 	})
				// 	return
				// }
				if (!this.shop.shopNotice) {
					uni.showToast({
						title: '请填写店铺公告',
						icon: 'none',
						duration: 1000
					})
					return
				}
				// if (!this.shop.snCode) {
				// 	uni.showToast({
				// 		title: '请填写设备sn编码',
				// 		icon: 'none',
				// 		duration: 1000
				// 	})
				// 	return
				// }
				// if (!this.shop.value) {
				// 	uni.showToast({
				// 		title: '请填写设备key秘钥',
				// 		icon: 'none',
				// 		duration: 1000
				// 	})
				// 	return
				// }

				if (!this.shop.shopCover) {
					uni.showToast({
						title: '请上传店铺logo',
						icon: 'none',
						duration: 1000
					})
					return
				}
				if (!this.shop.shopBanner) {
					uni.showToast({
						title: '请上传店铺轮播图',
						icon: 'none',
						duration: 1000
					})
					return
				}
				// console.log('this.shop.putawayFlag',this.shop.putawayFlag)
				// return
				if (this.shop.putawayFlag == 0) {

					// if (!this.shop.errandMoney) {
					// 	uni.showToast({
					// 		title: '请填写配送费',
					// 		icon: 'none',
					// 		duration: 1000
					// 	})
					// 	return
					// }
					if (!this.shop.minimumDelivery) {
						this.shop.minimumDelivery = 0;
						// uni.showToast({
						// 	title: '请填写最低起送金额',
						// 	icon: 'none',
						// 	duration: 1000
						// })
						// return
					}
					if (!this.shop.exemptMinMoney) {
						this.shop.exemptMinMoney = 0;
						// uni.showToast({
						// 	title: '请填写减免配送费最小订单金额',
						// 	icon: 'none',
						// 	duration: 1000
						// })
						// return
					}
					console.log(this.shop.distributionDistance)
					// if (!this.shop.distributionDistance) {
					// 	uni.showToast({
					// 		title: '请填写最大配送距离',
					// 		icon: 'none',
					// 		duration: 1000
					// 	})
					// 	return
					// }
				}
				console.log(this.shop)
				// uni.setStorageSync('shopId', this.shop.shopId)
				this.$Request.postJsonA("/app/shop/updateShopMessage", this.shop).then(res => {
					if (res.code == 0) {
						uni.showToast({
							title: '修改成功',
							icon: 'none'
						})

						setTimeout(function() {
							uni.navigateBack()
							// uni.navigateTo({
							// 	url: '/my/publish/index'
							// })
						}, 1000)
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				});
			},
		}
	}
</script>

<style>
	page {
		background-color: #F5F5F5;
	}

	.bg {
		background-color: #FFFFFF;
	}


	.tabBox {
		border: 1rpx solid #999999;
		padding: 15rpx 20rpx;
		border-radius: 15rpx;
		font-size: 28rpx;
	}

	.btnnum {
		color: #005DFF;
		border: 1rpx solid #005DFF;
	}
</style>
